<template>
    <div class="suammry">
        <span>全部任务({{$store.state.tasklist.length }})</span>
        <span>已完成 ({{$store.state.tasklist.length - $store.getters.unFinishCount}})</span>
        <span>未完成({{$store.getters.unFinishCount}})</span>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
    .suammry{
        display: flex;
        align-items: center;
        font-size: 14px;
        span{
            display: inline-block;
            padding: 5px 15px;
            border-radius: 5px;
            background: lightseagreen;
            margin: 10px 0;
            margin-right: 10px;
            color: white;
        }
        span:nth-child(3){
            background: red;
        }
    }

</style>